import React, { Component } from 'react'

class Child extends Component {
  render() {
    // 子组件通过调用父组件传过来的修改方法来完成子对父数据的修改
    const { count, setCount } = this.props
    return (
      <div>
        <h3>child组件：{count}</h3>
        <button
          onClick={() => {
            setCount(10)
          }}
        >
          child++count++
        </button>
      </div>
    )
  }
}

class App extends Component {
  state = {
    count: 100
  }

  setCount = (n) => {
    this.setState((state) => ({
      count: state.count + n
    }))
  }

  render() {
    return (
      <div>
        <h2>app组件:{this.state.count}</h2>
        {/* 把数据传给子组件的同时，把修改数据的方法也传过去，注意this就可以 */}
        <Child count={this.state.count} setCount={this.setCount} />
      </div>
    )
  }
}

export default App
